<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>my</title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" href="https://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css">
		<script src="https://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
		<script src="https://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
		<style type="text/css">
			#myHead{
				width:100px;
				 height:100px;
				 margin: auto;
				  border: solid aquamarine 1px;
				   border-radius:50%;
				   overflow: hidden;
				   
			}
			#editInfo{
				width:100px;
				height: 40px;
				border-radius: 10px;
				margin-left:40%;
				
				
			}
			#main{
				height: 260px;
				background: url(img/Desert.jpg) no-repeat;
				background-size: 100% ;
				color: white;
				   font-family: "微软雅黑";
			}
		h3,h4{
				text-align: center;
			}
		</style>
	</head>
	<body>
		
<div data-role="page" id="pageone">
   <div data-role="header">
	 	<div id="main">
   			<div id="myHead">
			<img src="img/fire.png" width="100" height="100"/>
			</div>
			<h3>志铭</h3>
			<h4>关注:<span>24</span> | 粉丝:<span>123</span></h4>
  		</div>
  </div>
   
    <div data-role="navbar">
      <ul>
        <li><a href="#" class="ui-btn-active ui-state-persist" data-icon="home">课程</a></li>
        <li><a href="#pagetwo" data-icon="arrow-r">动态</a></li>
        <li><a href="#pagethree" data-icon="arrow-r">我的资料</a></li>
      </ul>
    </div>
    
     <div data-role="main" class="ui-content">
   
    <ul data-role="listview" data-inset="true">
      <li>
        <a href="#">
        
        <h2>推荐课程</h2>
        
        </a>
      </li>
      <li>
        <a href="#">
       
        <h2>我喜欢</h2>
       
        </a>
      </li>
      <li>
        <a href="#">
        
        <h2>历史记录</h2>
       
        </a>
      </li>
    </ul>
  </div>
   <div data-role="footer">
    <h1>版权所有</h1>
  </div>
</div>
 
 <div data-role="page" id="pagetwo">
  <div data-role="header">
	 	<div id="main">
   			<div id="myHead">
			<img src="img/fire.png" width="100" height="100"/>
			</div>
			<h3>志铭</h3>
			<h4>关注:<span>24</span> | 粉丝:<span>123</span></h4>
  		</div>
  </div>
   
    <div data-role="navbar">
      <ul>
        <li><a href="#pageone"  data-icon="home">课程</a></li>
        <li><a href="#pagetwo" class="ui-btn-active ui-state-persist" data-icon="arrow-r">动态</a></li>
        <li><a href="#pagethree" data-icon="arrow-r">我的资料</a></li>
      </ul>
    </div>

  <div data-role="main" class="ui-content">
    
    <ul data-role="listview" data-inset="true">
      <li>
        <a href="#">
        <img src="img/fire.png">
        <h2>我的粉丝</h2>
        
        </a>
      </li>
      <li>
        <a href="#">
        <img src="img/fire.png">
        <h2>我的关注</h2>
       
        </a>
      </li>
      <li>
        <a href="#">
        <img src="img/fire.png">
        <h2>我的问答</h2>
       
        </a>
        </li>
    </ul>
  </div>
 <div data-role="footer">
    <h1>版权所有</h1>
  </div>
  
</div> 
	
<div data-role="page" id="pagethree">
  <div data-role="header">
	 	<div id="main">
   			<div id="myHead">
			<img src="img/fire.png" width="100" height="100"/>
			</div>
			<h3>志铭</h3>
			<h4>关注:<span>24</span> | 粉丝:<span>123</span></h4>
  		</div>
  </div>
   
    <div data-role="navbar">
      <ul>
        <li><a href="#"  data-icon="home">课程</a></li>
        <li><a href="#pagetwo" data-icon="arrow-r">动态</a></li>
        <li><a href="#pagethree" class="ui-btn-active ui-state-persist" data-icon="arrow-r">我的资料</a></li>
      </ul>
    </div>

   <div data-role="main" class="ui-content">
   
    <ul data-role="listview">
      <li data-role="list-divider">个人信息</li>
      <li>地区：南昌</li>
      <li>单位：江财</li>
      <li>生日：</li>
      <li>学习时长：12h</li>
      <li data-role="list-divider">个人介绍</li>
      <li><a href="#">个性签名：试玉要烧三日满，辨材须待七年期</a></li>
     
    </ul>
  </div>
   <div data-role="footer">
    <h1>版权所有</h1>
  </div>
</div> 
	</body>
</html>
